<template>
  <a-layout-sider width="200">
    <b-menu :style="{ height: '100%', borderRight: 0 }" :menu="menus" :collapsed="collapsed" @select="onSelect" @updateMenuTitle="onUpdateMenuTitle" mode="inline"></b-menu>
  </a-layout-sider>
</template>

<script>
import BMenu from './index'
export default {
  name: 'SideMenu',
  components: {BMenu},
  props: {
    collapsible: {
      type: Boolean,
      required: false,
      default: false
    },
    collapsed: {
      type: Boolean,
      required: false,
      default: false
    },
    menus: {
      type: Array,
      required: true
    }
  },
  methods: {
    onSelect (obj) {
      this.$emit('menuSelect', obj)
    },
    onUpdateMenuTitle(obj) {
      this.$emit('updateMenuTitle', obj)
    }
  }
}
</script>

<style scoped>

</style>
